<!DOCTYPE html>
<title>Test batch copyTo() performance with VideoFrame from canvas</title>
<script src="../resources/runner.js"></script>
<script src="videoFrame-utils.js"></script>
<script src="copyTo-test.js"></script>
<canvas id="canvas" width="1280" height="720"></canvas>

<script>
(async function() {
  const canvas = document.querySelector('canvas');
  const ctx = canvas.getContext('2d');

  let frames = [];
  // Sufficient number of frames to exercise parallelism as much as possible
  // without making the test too slow.
  const number_of_frames_to_copy = 20;
  for (let i = 0; i < number_of_frames_to_copy; i++) {
    await waitForNextFrame();
    fourColorsFrame(ctx, canvas.width, canvas.height, i.toString(2));
    ctx.clearRect(0, 0, canvas.width, canvas.height);
    let frame = new VideoFrame(canvas, {timestamp: i});
    frames.push(frame);
  }

  runBatchCopyToTest(
    frames, "CPU time for batch copyTo() w/ VideoFrames from canvas");
})();
</script>
